import Taro from '@tarojs/taro-rn';
import * as tslib_1 from "tslib";
import React from 'react';
import { Component } from "@tarojs/taro-rn";
import { View, Image, Text } from "@tarojs/components-rn";
import { toJS } from 'mobx';
import { inject, observer } from "@tarojs/mobx-rn";
import { getRuntime, pageSize } from "../../utils/common";
import custom_listStyleSheet from "./custom_list_styles";
var _styleSheet = custom_listStyleSheet;

let CustomList = class CustomList extends Component {
  constructor(props) {
    super(props);
    this.state = {
      customizedCategoryId: null,
      pageIndex: 1,
      pageSize,
      totalCount: 0,
      items: []
    };
  }
  componentWillMount() {
    Taro.setNavigationBarTitle({ title: '礼品定制中心' });
    let customizedCategoryId = parseInt(this.$router.params.id);
    if (!customizedCategoryId) {
      getRuntime().navigateBack();
    }
    this.setState({
      customizedCategoryId
    }, () => {
      this.getCustomizedInfo();
    });
  }
  getCustomizedInfo() {
    let { PointMallStore } = this.props.stores;
    let { customizedCategoryId, pageIndex, pageSize } = this.state;
    PointMallStore.getCustomizedInfo({
      formCustomizedCategoryId: customizedCategoryId,
      pageIndex,
      pageSize,
      callback: res => {
        let { totalCount, items } = toJS(res);
        this.setState({
          totalCount,
          items
        });
      }
    });
  }
  handelRouter(url = '/pages/index/index') {
    getRuntime().navigateTo(url);
  }
  render() {
    let { items } = this.state;
    return <View style={_styleSheet["mall-custom-index"]}>
        <View style={_styleSheet["list-14"]}>
          {items.length > 0 && items.map(item => {
          return <View onClick={this.handelRouter.bind(this, `/pages/mall/custom_detail?id=${item.id}&type=custom`)} style={_styleSheet["list-14-item"]}>
                  <Image src={item.picture} style={_styleSheet["item-img"]} />
                  <View style={_styleSheet["info"]}>
                    <View style={[_styleSheet["title"], _styleSheet["list-title"]]}>
                      {item.name}
                    </View>
                    <View style={[_styleSheet["price"], _styleSheet["list-price"]]}><Text style={[_styleSheet["small"], _styleSheet["list-small"]]}>￥</Text>{item.price}</View>
                  </View>
                </View>;
        })}
          {items.length <= 0 && <View style={_styleSheet["page-none-info"]}>暂时没有相关产品信息~</View>}
        </View>
      </View>;
  }
};
CustomList = tslib_1.__decorate([inject("stores"), observer], CustomList);
export default CustomList;